import type{ VNode } from "vue";
// 选项属性
export interface SelectOption {
  label:string;
  value:string;
  disabled?:boolean;
}

// 自定义类型
export type RenderLabelFunc = (option:SelectOption) => VNode;
export type CustomFilterFunc = (value:string)=> SelectOption[];
export type CustomFilterRemoteFunc  = (value:string)=>Promise<SelectOption[]>

// select 属性 
export interface SelectProps{

  // v-model
  modelValue:string;

  // 选项们
  options?:SelectOption[];

  // 基本的表单属性
  placeholder:string;
  disabled:boolean;

  // 是否可选
  clearable?:boolean;
  
  // 过滤
  filterable?:boolean;
  filterMethod?:CustomFilterFunc;

  // 远程过滤
  remote?:boolean;
  remoteMethod?:CustomFilterRemoteFunc;
}

// select 事件
export interface SelectionEmits{
  // 对外提供的 change 事件
  (e:'change',value:string):void;
  // v-model
  (e:'update:modelValue',value:string):void
  // 代表当前的 select 是 打开还是 关闭的 状态
  (e:'visible-change',value:boolean):void
  // 
  (e:'clearInput'):void
}

// 记录当前的 选中的选项
export interface stateOption{
  curInput:string,
  curOption:SelectOption | null,
  mouseHover:boolean,
  loading:boolean;
}

